﻿
/*html, body{
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }

        .container {
            height: auto;
            width: 100%;
        }

        h1 {
            padding: 0;
            margin: 0;
        }

        h2 {
            padding: 0;
            margin: 0;
            text-align: center;
        }
        h3 {
            padding: 0;
            margin: 0;
        }
        div {
        }*/
.plate {
    display: flex;
    justify-content: center;
    overflow: hidden;
}

.plate img {
    padding: 0;
    margin: 0;
    /*max-height: 70%;*/
    height: 200px;
    max-width: 100%;
    text-align: center;
}

/*    #connection{
            position: absolute;
            top: 0px;
            right: 0px;
        }*/

body {
    margin: 0
}

#connection h3 {
    text-align: right;
}

.left, .right {
    height: calc(100vh - 42px)
}

#in_plate, #out_plate {
    text-align: center;
    margin-top: 30px;
}

.slideIn {
    position: relative;
    animation-name: slideIn;
    animation-duration: .6s;
}

@keyframes slideIn {
    /*        0%{top:-100px;opacity:0}
            100%{top:0;opacity:1}*/

    0% {
        left: 100%;
        opacity: 0
    }

    100% {
        left: 0;
        opacity: 1
    }
}


